@import "_function";

.shop-cart-page{

  .check{
    input{
      display: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
    }
    input[type=checkbox]+i{
      .w(40);
      .h(40);
      .fl;
      border-radius: 50%;
      .bc(@c90);
      background-image: url("../img/icon_check.png");
      .bs(30,30);
      background-position: center;
      .ml(14);
      .mr(20);
    }
    input[type=checkbox]:checked+i{
      .bc(@cred);
    }
  }

  .title{
    .h(90);
    .fs(38);
    .lh(90);
    .c(@c18);
    .tc;
    border-bottom: 2px solid @cb5;
    .edit{
      .fs(26);
      .c(@c8f);
      .fr;
    }
  }

  .list{
    &.container{
      .pb(200);
    }
    .item{
      .mt(20);
      .mb(20);
      input[type=checkbox]+i{
        .mt(98);
      }
    }
    .pic{
      .w(190);
      .h(190);
      .br(8);
      .fl;
      .mr(38);
    }

    .desc{
      .h(190);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      h3{
        .fs(26);
        .lh(32);
        font-weight: normal;
        .c(@c43);
      }
      .type{
        .fs(26);
        .c(@c8f);
        display: flex;
        justify-content: space-between;
        .pr(42);
        .del{
          .h(46);
          .w(122);
          .tc;
          .lh(46);
          .bc(@cred);
          .c(@colorW);
          position: relative;
          .l(42);
        }
      }
      .order{
        .fs(26);
        display: flex;
        justify-content: flex-start;
        .c(@color6);
        &.edit{
          .price{
            text-align: right;
          }
        }
        div{
          width: 50%;
          text-align: center;
        }
        button{
          .w(42);
          .h(42);
          .fl;
          border:1px solid @c8f;
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
        }
        input[type=number]{
          .w(60);
          .h(42);
          .fl;
          .tc;
          .bc(#c9c9c9);
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          border:none;
          //border-top: 1px solid #959595;
          //border-bottom: 1px solid #959595;
        }
        .price{
          text-align: left;
          .c(@cred);
          span{
            .fs(32);
          }
        }
      }
    }
  }

  .total{
    position: fixed;
    .bc(@colorW);
    .b(100);
    .w(750);
    .l(0);
    border-top: 2px solid @cb5;
    .left{
      .fl;
      .w(450);
      .p(0,25,0,25);
      .h(90);
      display: flex;
      justify-content: space-between;
    }
    .check{
      .mt(32);
    }
    .price{
      .pt(10);
      width: 50%;
      div{
        .c(@cred);
        .fs(28);
      }
      span{
        .fs(32);
      }
      p{
        .c(@c8f);
        .fs(26);
      }
    }
    .pay{
      .fr;
      .w(250);
      .bc(@cred);
      .h(90);
      .fs(38);
      .lh(90);
      .tc;
      .c(@colorW);
    }
  }
}
.bottom-bar{
  .h(100);
  .w(700);
  position: fixed;
  .l(0);
  .b(0);
  display: flex;
  justify-content: space-between;
  .bc(#1a1b2a);
  .item{
    .w(100);
  }
  img{
    .w(70);
    .h(70);
    margin:0 auto;
    .db;
  }
  span{
    .fs(22);
    .lh(22);
    .c(@colorW);
    .db;
    .h(30);
    .tc;
  }
  .on{
    .bc(#00a0e9);
  }
}